Thư viện Javascript

- Tạo “mưa tuyết”
Bạn muốn thấy cảnh mưa tuyết rơi trên trang Web của mình? Xin mời bạn tải về đoạn mã JavaScript. Các bông tuyết được vẽ bằng công cụ Airbrush trong Microsoft Paint, kích thước 10x10 pixel, lưu thành tập tin blue_snow.gif. Chương trình có thể chạy được trên cả Internet Explorer 4.0 và Netscape Navigator 4.0 trở lên.

- Đặt mật khẩu cho trang Web
Bạn có thể hạn chế số người truy cập trang web của bạn bằng cách tạo thêm trang web có chứa đoạn Script dưới đây làm trang đòi hỏi mật khẩu. Khi người xem nhập đúng mật khẩu, họ sẽ được chuyển qua trang cần xem. Chú ý: cách đặt mật khẩu này có thể giúp bạn hạn chế bớt việc truy cập “ngoài ý muốn” nhưng không thể qua mặt được các tay chuyên nghiệp.

- Tạo chữ từ nhỏ phóng to ra màn hình
Đoạn mã này giúp bạn tạo một loạt những câu (hoặc từ) tự động phóng từ nhỏ đến to trên màn hình, thích hợp cho việc quảng cáo hoặc tạo ấn tượng cho Website của bạn. Bạn có thể thay đổi kiểu hiển thị của Font chữ, tốc độ và kích cỡ của chữ...

- Máy tính đơn giản
Bạn có thể tạo một Máy tính số học đơn giản trong trang Web với các chức năng: cộng, trừ, nhân, chia và tính luỷ thừa

- Bảo vệ trang web bằng Javascript
Các đoạn Javascript này giúp bạn bảo vệ trang Web của mình tránh bị copy tràn lan. Kỹ thuật sử dụng rất đơn giản là không cho dùng chuột phải để mở menu đồng thời vô hiệu thao tác đánh dấu chọn bằng chuột cũng như phím Ctrl+A (chọn tất cả nôi dung).

- Đồng hồ kim di chuyển theo chuột
Đoạn mã này sẽ tạo ra một đồng hồ tự động chạy theo “sát nút” con trỏ chuột khi di chuyển chuột trong trang Web. Đồng hồ có kim chỉ giờ, phút, giây và có một vòng bao quanh phía ngoài chỉ ngày tháng. Bạn có thể thay đổi kích thước đồng hồ, cách hiển thị của giờ, ngày tháng. Thay đổi màu cho kim, cho giờ và ngày, điều chỉnh tốc độ xoay của vòng ngày tháng, dịch chuyển vị trí của đồng hồ so với chuột..

- Đặt lịch vào trong trang Web
Thêm vào trang Web của bạn một tấm lịch ngày tháng (calendar), tự động “xé lịch” theo ngày thứ hiện tại của máy tính (ngày, thứ được làm đậm). Bạn có thể thay đổi kích thước, màu sắc, chuyển tháng, thứ sang tiếng Việt với font Unicode...

- Tạo một cửa sổ PopUp
Giúp bạn thiết kế một cửa sổ Popup giống như các cửa sổ quảng cáo hay là thông tin, tin tức. Cửa sổ này sẽ hiện lên sau 3 giây (thay đổi bằng thông số trong dòng setTimeout('windowProp(text)', 3000); khi mở trang Web, và tự động tắt sau 5 giây (thay đổi bằng thông số trong dòng setTimeout('closeWin(newWindow)', 5000);

- Tạo chữ rực lửa
Để trang trí cho tiêu đề của trang Web thêm sinh động, chúng ta hãy làm cho nó “rực chói” lửa đỏ bằng Java Script khiến ai nhìn vào cũng phải chói mắt. Cái này bạn có thể kết hợp với đoạn mã tạo “Màn hình rung chuyển” của bác Bảo Kha. Lúc đó thì hỏa hoạn xem làm rung trời lở đất trên màn hình(hi hi). Ở đây, tôi chỉ làm “chữ rực lửa” còn nếu các bạn có nhu cầu thì cho thêm đoạn mã của bác Bảo Kha vào.

- Đặt Logo vào trong trang Web
Đoạn mã này giúp bạn đưa một hình Logo vào trang web của bạn, nó sẽ luôn nằm góc phải phía dưới màn hình và luôn giử vị trí cố định cho dù bạn kéo trang web lên hay xuống. Chú ý là Logo này bạn phải dùng các phần mềm đồ hoạ để thiết kế riêng và đưa vào. Bạn có thể điều chỉnh kích thước và vị trí của logo tuỳ ý.

- Tạo dòng chữ chạy trong Status bar của Internet Explorer
Tạo các dòng chữ chạy và thay đổi nhau trên thanh trạng thái (Status Bar) của Internet Explorer. Bạn có thể điều chỉnh tốc độ, thay đổi nội dung cũng như số lượng các dòng chữ.

- Tự động thay đổi hình ảnh
Những hình ảnh trong trang Web sẽ thay đổi tuần tự một cách rất đẹp, rất bắt mắt người lướt web. Bạn có thể thêm hay bớt hình, thay đổi hình hiển thị đầu tiên, co giản kích thước lớn nhỏ cho thích hợp với trang web.

- Lập “lịch công tác”
Ngày nay, với sự phát triển mạnh mẽ của hầu như mọi lĩnh vực trong xã hội, không mấy ai được an nhàn “đếm lá mùa thu rơi trong những chiều thu mát rượi” mà hàng ngày phải vùi đầu vào cả núi công việc. Để sắp đạt công việc một cách khoa học và hợp lý, xin giới thiệu với các bạn một cách lập lịch công tác bằng ngôn ngữ JavaScript mà ai cũng có thể làm được.

- Chữ chạy trên thanh trạng thái
Có nhiều chiêu đối với thanh trạng thái của trình duyệt Web. Kỳ này xin giới thiệu cùng các bạn “dòng chữ chạy trên thanh trạng thái”. Bạn chỉ cần “dán” đoạn mã JavaScript này vào trang Web của mình. Nếu cần, bạn có thể thay đổi nội dung dòng chữ cho phù hợp.

- Trang Web biết chào hỏi
Đoạn code này giúp bạn đưa một câu chào vào trong trang Web của mình mỗi khi trang Web đó được mở lên ở thời gian nào đó trong ngày. Ví dụ như là: Good morning!, Good afternoon!..., bạn không cần phải dùng câu Welcome to my web... Tuy nhiên, nó chỉ đúng khi giờ trong hệ thống của bạn trùng với giờ thực tế.

- Tạo những ô vuông sáng lấp lánh di chuyển theo chuột
Bạn đã từng thấy các hiệu ứng kèm theo chuột thật bắt mắt trên các Web site (thường được tạo bằng Macromedia Flash)? Xin giới thiệu với các bạn đoạn mã JavaScript “biến hóa cái đuôi chuột” cho dài hơn, lấp lánh nhiều màu sắc. Bạn chỉ cần dán đoạn mã này vào giữa thẻ <body> và </body>, sau đó từ từ “ngâm cứu” để thay đổi màu sắc, kích thước, tốc độ di chuyển của “cái đuôi” này.

- Tạo dòng chữ xoay quanh con trỏ chuột
Dòng chữ “JavaScript như bánh mì Sài Gòn” sẽ xoay tròn quanh con trỏ chuột. Chương trình viết bằng JavaScript được chú thích “cực kỳ” đầy đủ, bảo đảm bạn sẽ hài lòng.

- Đồng hồ đếm ngược thời gian
Bạn muốn tạo đồng hồ đếm ngược thời gian để nhắc nhở mình một sự kiện quan trọng cần ghi nhớ? Dán đoạn mã kèm theo vào trang Web của bạn. Ngày của sự kiện được tô màu đỏ trong mã nguôn, bạn có thể thay đổi thành một ngày khác như ngày ... khai mạc Seagames 22 chẳng hạn ;-)

- Tự tạo nút Scroll
Bạn không cần phải dùng nút Scroll trên chuột, không cần phải dùng thanh cuộn của trình duyệt mà vẫn “thoải mái đi tới đi lui” trên trang Web. Bạn chỉ cần dán đoạn mã JavaScript kèm theo vào Web site của mình và ... a lê hấp, rà chuột lên nút

để đi xuống, và rà chuột lên nút

để đi lên.

- Khúc dạo đầu cho trang Web
Một số trang Web trên Internet thường có những đoạn mở màn bằng đồ họa rất đẹp, một số trang khác lại xuất hiện lời chào, hoặc những thông báo cần thiết đến người lướt Web. Xin giới thiệu với các bạn một cách xử lý nhẹ nhàng mà hiệu quả. Bạn có thể tìm những hình ảnh thích hợp và thay đổi đường dẫn trong mã nguồn, màn hình giới thiệu sẽ tự động tắt sau vài giây.

- Bong bóng ... bay
Chỉ cần chèn đoạn mã JavaScript kèm theo vào mã nguồn Website của bạn là đã có thể đưa những quả bong bóng đầy màu sắc tuổi thơ lên... Internet! Trang Web sẽ hấp dẫn và sinh động hơn nhiều. Chúc các bạn ngon miệng với JavaScript - “bánh mì Sài gòn”.

- User ID và Password
Kiểm tra mật khẩu là việc quá quen thuộc nếu như bạn thường xuyên kết nối Internet, “check mail”, vv... Tuy có vẻ phức tạp nhưng thật sự bạn hoàn toàn có thể đặt một đoạn kiểm tra “nho nhỏ” vào trang Web của mình. Bạn hãy chép đoạn mã trên Website của e-CHÍP và “gắn” chúng vào sau thẻ <body>. Từ nay, mỗi khi truy cập trang Web của bạn, khách thăm sẽ phải nhập ID và password rồi mới được mời vào. Chúc bạn thành công! Nhưng làm chơi thôi và chỉ khi trang Web của bạn có nhu cầu bảo mật cao, còn không thì coi chừng mất khách!

- Đồng hồ nhiều múi giờ
Một đồng hồ có được nhiều múi giờ? Quá đã phải không bạn! Mời bạn “nhào dzô” thử chơi. Muốn biết giờ của nơi nào, bạn chỉ cần nhấp chuột vào nút tương ứng là ... xong.

- Thước đo cho Web
Do yêu cầu thiết kế, đôi khi trang Web của bạn không đóng khung trình bày nên ... hơi bị khó khi đọc dữ liệu. Đoạn mã JavaScript tôi giới thiệu với các bạn tạo ra một hiệu ứng nhẹ nhàng mà vô cùng hiệu quả: một thước đo canh ngang và dọc trên trang Web dựa trên vị trí của con trỏ chuột, giúp bạn tra cứu dữ liệu dễ dàng.

- Tạo trình đơn (menu) động trên trang Web
Khi lướt Net cũng như lúc xây dựng trang Web, trình đơn động là một công cụ rất mạnh, vừa tiện lợi về mặt tạo liên kết vừa giúp trang Web của bạn có thêm không gian để trình bày. Chỉ có một góc “nho nhỏ” của trình đơn xuất hiện, còn nội dung chính thì “núp” sau trang Web và chỉ hiện ra khi bạn rê chuột lên. Phần mã Java Script dành cho trình đơn được tách thành hai tập tin , bạn có thể chỉnh sửa lại màu sắc, phông chữ, ... cho phù hợp.

- Dòng chú thích liên kết
Dòng chú thích cho các liên kết thường xuất hiện ở những trang Web có “trách nhiệm” , mô tả ngắn gọn liên kết đó trỏ đi đâu, nội dung gì. Chỉ với một câu lệnh đơn giản OnMouseOver = “ popup(‘ Dòng chú thích ở đây ’, ‘ tên màu sắc’ ) ” ; là hầu như bạn đã có câu chú thích cho riêng mình rồi đó. Bạn đọc bài viết chi tiết và tải về mã nguồn tại Website của e-Chíp. Chúc bạn thành công!

- Tạo chuyển động quay quanh chuột
Các chuyển động quay quanh chuột trên trang Web thì “hằng hà sa số”, nhưng bạn có thể yên tâm là chuyển động dưới đây là “chơi được”. Các quả bóngĠ sẽ bay quanh con trỏ chuột như những vệ tinh bay quanh quả đất vậy, rất sinh động và dễ thương. Nếu chưa thích , bạn có thể thay đổi số lượng bóng và hình quả bóng.

- Màn hình giới thiệu
Một bài nhạc thường có phần mở đầu gọi nhẹ nhàng là intro. Trang Web cũng vậy , đôi khi bạn muốn “nhắn nhủ” vài điều với “khách thập phương”. Lúc này chắc chỉ còn cách làm khúc intro cho mình. Mời bạn “vọc” thử đoạn mã Java Script làm trang mở đầu cho Website. Trong mã nguồn có hướng dẫn chi tiết, bạn có thể mở trang Web rồi chọn trình đơn View > Source (đối với trình duyệt Internet Explorer) để xem mã nguồn.

- Tạo menu chuyển động
Có nhiều giải pháp cho việc trình bày các trình đơn cho một trang Web. Xin giới thiệu với các bạn một “chiêu”: tạo menu chuyển động. Trình đơn chính cho trang Web sẽ luôn xuất hiện cho dù bạn di chuyển lên hay xuống để xem thông tin. Bạn chỉ cần chép mã nguồn rồi dán vào Website của mình (vị trí nào cũng được), sau đó chỉnh sửa các đường dẫn cho thích hợp và thế là xong!

- Màn hình rung chuyển rồi... mất tiêu
Chương trình sẽ làm màn hình Web rung chuyển rồi di chuyển (kích thước nhỏ dần) từ góc trên-trái về góc dưới-phải. Bạn xem mã nguồn bằng cách vào trình đơn View>Source trong trình duyệt (Internet Explorer).

- Soi gương... trên Web
Một chú sư tử đang “ngẩn ngơ” ngắm mình bên dòng nước, rất hấp hẫn và hiệu quả nhưng lại thật đơn giản. Chỉ với vài câu lệnh đặt sau thẻ <BODY> là bạn đã có được hiệu ứng “soi gương”. Bạn có thể thay đổi đường dẫn hình ảnh cho phù hợp với nhu cầu của mình (bạn nhớ lưu ý về kích thước hình nhé).

- “eChip Revolution”
Một hiệu ứng thường thấy trong các đoạn giới thiệu phim... hành động (có liên quan ít nhiều đến “computer”), như phim Matrix chẳng hạn. Sau một khoảng thời gian, dòng chữ “eChip – Tin học như cơm bình dân” sẽ xuất hiện. Bài hướng dẫn chi tiết có trên Website của e-Chíp, mời các bạn “nhào vô”.

- Tạo chữ chạy trong nút lệnh
Có nhiều cách để trang trí nút lệnh, một đối tượng xuất hiện rất nhiều trên các trang Web. Bạn có thể làm cho nó đổ bóng, có hình dạng đặc biệt, vv.... Tôi xin giới thiệu với các bạn đoạn mã Java Script tạo một dòng chữ chạy từ phải sang trái trong nút lệnh. Các bạn tải về ví dụ từ Website của e-Chíp. Để xem mã nguồn, các bạn chọn trình đơn View > Source (đối với trình duyệt Internet Explorer).

- Tạo trình đơn cho chuột phải
Khi nhấp chuột phải vào bất kỳ vị trí nào trong trang Web, bạn sẽ có ngay một trình đơn hiện ra chờ “phục vụ”. Đoạn mã cần được dán vào sau thẻ <BODY>, bạn có thể “thêm mắm dặm muối” để trình đơn thay đổi về màu sắc và danh sách các liên kết.

- "Nhấn nhá” các loại cho dòng văn bản
Bạn hoàn toàn có thể tạo “hào quang” các kiểu cho dòng văn bản thông qua bộ lọc, các tham số được đưa vào vòng lặp để có hiệu quả “động”. Ví dụ có thể tải về từ trang Web của e-CHÍP. Để xem mã nguồn, bạn chọn View > Source từ trình đơn của Internet Explorer.

- Sắc màu cho... chú chuột
Để thêm phần sinh động cho Website, xin giới thiệu các bạn một chiêu: thêm màu sắc cho... chú chuột. Tiêu điểm gặp nhau của ba dãy màu Red, Green, Blue chính là con trỏ chuột. Bạn download chương trình từ Website e-CHÍP, chọn View > Source (đối với trình duyệt Internet Explorer) để xem mã nguồn, sau đó chép đoạn mã này rồi dán vào trang Web của mình. Bạn có thể tìm và thay thế màu sắc khác cho phù hợp với mình hơn, chúc các bạn thành công!

- Đồng hồ trên thanh tiêu đề
Trên trang Web, bạn có thể “vọc” thanh trạng thái hoặc thanh tiêu đề để cung cấp thêm thông tin cho người lướt Net. Chương trình viết bằng JavaScript (có trên Website e-CHÍP) sẽ hiển thị một đồng hồ gồm các thông tin Thứ, Ngày, Tháng, Năm, Giờ. Bạn chỉ cần tải về chương trình này, rồi dán đoạn mã vào chương trình của mình, “dzậy là xong rùi” !

- Đặt minigame vào trang Web
Trên đường lướt Net, hẳn hơn một lần các bạn thấy những game nhỏ trên các Website rất hấp dẫn. Với “chút vốn lận lưng” về JavaScript, bạn cũng có thể thực hiện khá nhiều việc, ngay cả xây dựng cho mình một trò chơi nho nhỏ. Xin giới thiệu cùng các bạn ba trò chơi: đoán chữ (góp phần tăng cường khả năng tiếng Anh của bạn), máy đo tình yêu (nhưng tui hổng dám đảm bảo nếu bạn bị người yêu “uýnh” đâu nghen?) và Carô 9 ô – tương tự trò chơi TicTacToe.

- Hiệu ứng “đánh máy” trong hộp văn bản
Những thông tin bạn muốn gởi đến người lướt Web sẽ lần lượt xuất hiện trong một hộp văn bản (textbox) như là đang được đánh máy từng ký tự một. Hiệu ứng này thật đơn giản nhưng lại tăng vẻ sinh động của trang Web. Nếu điều chỉnh co chữ, thay đổi màu sắc “chút xíu”, biết đâu bạn lại có được một bảng quảng cáo điện tử?

- Chơi game trên Web
Trò chơi hứng bóng có luật chơi đơn giản thôi: bạn di chuyển chuột (tương ứng tọa độ chuột, bốn thanh đỡ cũng di chuyển theo) để hứng bóng, nếu bóng chạm các cạnh là bạn mất một bóng. Sau một số lần chạm, các ô vuông sẽ đổi màu và biến mất, khi đó bạn … chiến thắng. Tuy nhiên, nếu mất hết bóng bạn sẽ thua.
Muốn đặt game này vào một liên kết trong trang Web, bạn thêm dòng sau:
<a href="javascript:Hungbong()">Games Hứng Bóng</a>
Chúc bạn thành công!

- Cửa sổ “biết bay”
Một cửa sổ hiện ra và … bay “tùm lum” trên trang Web. Ồ, bạn đừng ngạc nhiên! Cửa sổ này bay theo “quy hoạch” đấy nhé, bạn có thể lập trình chỉnh sửa quỹ đạo bay của nó, cũng đơn giản thôi. Tuy nhiên, công dụng lớn nhất của “chiêu” này chính là thu hút sự chú ý của người lướt Web. Bạn đưa những thông tin thật hấp dẫn vào trong cửa sổ này và thế là xong.

- Chiếc đồng hồ thần kỳ
Trong khi lướt Net, chat với bạn bè, nhiều lúc bạn cũng cần biết múi giờ các nước để còn “tham khảo”. Trong Windows cũng có một đồng hồ vạn năng như thế, thậm chí còn “xịn” hơn nhiều. Tuy nhiên nếu trên Website của mình bạn có cài đặt một chiếc đồng hồ tương tự kể ra cũng lý thú lắm. Tôi xin gởi đến các bạn chưong trình JavaScript hiển thị múi giờ năm châu lục, chương trình khá dài, tuy nhiên bạn có thể tìm hiểu và thay đổi giao diện khá dễ dàng.

- Pháo hoa trên trang Web
Năm hết Tết dến, xin giới thiệu cùng bà con cô bác “tiểu xảo” bắn pháo hoa trên trang Web cho “dzui”. Gọi là “tiểu xảo” vì có nhiều thuật giải và kiểu bắn rất đẹp và phức tạp, tuy nhiên cách đơn giản và dễ thực hiện lại là cách... “tui” trình bày trên Website e-Chíp, xin mời mọi người tải về xem thử.

- Mã nguồn của trang Web
Nhiều trang Web cho phép bạn “lấy” mã nguồn thoải mải (thông qua chức năng View | Source của trình duyệt), tuy nhiên một số trang khác lại “bế quan tỏa cảng” với mọi người. Nếu muốn cung cấp luôn mã nguồn (đặc biệt là trong lĩnh vực đào tạo, giảng dạy), bạn có thể tạo liên kết cho mở thêm một cửa sổ để người lướt Web xem source.

- Dòng chữ lung linh
Bộ lọc (filter) cho rất nhiều hiệu ứng đẹp khi bạn dùng JavaScript để hiển thị các đối tượng. Đoạn chương trình tôi giới thiệu với các bạn làm cho dòng chữ lung linh nhảy múa từ nhẹ đến mạnh... Bạn có thể tải chương trình từ Website của e-Chíp, và hãy thử chỉnh sửa các thông số để xem hiệu ứng thay đổi như thế nào nhé...

- Bắn chữ
Dòng chữ “Echip – Tin học như cơm bình dân” sẽ được “bắn xối xả” lên góc trên - trái màn hình. Chương trình cũng đơn giản thôi, các bạn sẽ rất dễ dàng khi tìm hiểu mã nguồn để thay đổi các tham số.

- Dòng chữ vui nhộn
Một “banner” quảng cáo rất sống động và ấn tượng, bảo đảm trang Web của bạn sẽ làm các vị khách “hết hồn” khi ghé thăm. Dòng chữ sẽ được xuất hiện theo hình làn sóng nhấp nhô rất đẹp. Bạn có thể thay đổi nội dung phần văn bản thể hiện trong câu lệnh var theText = "Tin Hoc Nhu Com Binh Dan".

- e-Chíp... bay vào không gian
Những ký tự lần lượt bay vào một không gian bí ẩn và vô tận tương tự như một screen saver của Windows, một hiệu ứng thật đẹp phải không bạn? Ở góc độ lập trình, bạn cũng có thể xem đó là quá trình “vẽ nhỏ dần những ký tự với tọa độ hướng tâm”. Các bạn tải mã nguồn từ Website của e-Chíp và chèn đoạn mã này sau thẻ <body>:
<SCRIPT SRC="khonggianechip.js" language="JavaScript1.2"></SCRIPT>

- Tô sáng liên kết (bằng hình ảnh)
Mỗi lần chuyển hướng liên kết trong các Website, thường các liên kết sẽ được gắn với các nút nhấn, hình ảnh, vv… Một việc chúng ta thường phải làm là “tô sáng” liên kết đang được chọn (liên kết đang được rê chuột lên). Xin giới thiệu với các bạn một cách “giải quyết” ngắn gọn. Mời các bạn ghé xem và chép chương trình cùng các hình ảnh kèm theo tại Website e-Chíp.

Số 62 (16-01-2004)

- Chuột rượt... Gà
Chuyện chú mèo vờn chú chuột chắc là ai cũng biết, còn chuyện chú chuột “dí” gà con là chuyện mới đây thôi. Muốn tìm hiểu mời các bạn ghé thăm website e-Chíp mục JavaScript để tải về. Mỗi lần bạn di chuyển chuột đến gần gà con là gà con “biến” ngay. Hiện tại chương trình chỉ xác định một cờ nhớ để điều khiển 3 vị trí cho gà con. Nếu có thể bạn sửa chương trình để tọa độ gà con là ngẫu nhiên sẽ hấp dẫn hơn.

- Tô sáng liên kết và chú thích
Trên trang web thông thường có rất nhiều các liên kết đến những địa chỉ có nội dung liên quan, hỗ trơ... Việc tô sáng các liên kết khi người duyệt web rê chuột bên trên trở nên phổ biến. Tuy nhiên có một số các liên kết cần được chú thích cho rõ ràng hơn. Xin giới thiệu cùng các bạn một hiệu ứng: tô sáng hình ảnh (có gắn liên kết) đồng thời hiện dòng chú thích kế bên khi người duyệt web trỏ chuột đến. Dòng chú thích sẽ hiện ra trong một khoảng thời gian sau đó từ từ mất đi (fade out).

- Lời chào hỏi thú vị
Những dòng chữ sẽ bay ra màn hình như một màn trình diễn đồ họa tuyệt đẹp. Trên trang web có hướng dẫn chi tiết và mã nguồn, bạn có thể tìm hiểu và thay đổi nội dung cho thích hợp với website của mình hơn.

Số 68 (06-02-2004)

- Menu đa tầng
Bạn có quá nhiều mục lựa chọn cho website của mình? Bạn muốn tiết kiệm tối đa không gian của website? Trình đơn đa tầng (gắn với chuột phải) có lẽ sẽ là giải pháp đơn giản nhất. Bạn có thể thêm vào thoải mái các mục trong trình đơn, vấn đề là phải sắp xếp cho hợp lý.

- Menu xoay
Xin giới thiệu cùng các bạn một “chiêu” khác cũng về cách trình bày menu trên trang web, đó là trình đơn xoay. Người dùng có thể nhấp chuột vào hai nút mũi tên để thay đổi (xoay) trình đơn. Ưu điểm của loại trình đơn này là tính hấp dẫn, lạ mắt. Bạn nên dùng loại trình đơn này nếu như website của bạn . . . còn dư chỗ.

- “Hồi đó” mình sinh vào ngày thứ mấy nhỉ?
Có bao giờ bạn “théc méc” rằng “hồi đó” mình sinh vào ngày thứ mấy trong tuần không? Có thể bạn sẽ dùng một chương trình “lịch vạn niên” để xem lại chẳng hạn, nhưng xem ra chỉ cần một đoạn JavaScript nhỏ là bạn đã giải quyết được vấn đề rồi. Mời bạn ghé thăm website e-chíp mục JavaScript để lấy chương trình về... xài thử.

- Đồng hồ 3D:
Đồng hồ 3 chiều xoay "tá lả" trong website, thật ấn tượng phải không bạn! Thêm 1 kiểu thể hiện website của bạn bằng cách kết hợp Applet vào trang web.

Nếu đã từng vọc Web và JavaScript, có thể bạn đã từng nghe nhạc... online. Xin giới thiệu cùng các bạn một cách chạy chữ trên Web trông như Karaoke vậy, dù chỉ là phần hình ảnh! Sao các bạn không thử kết hợp phần tiếng (nhạc) và phần hình (chạy chữ) ? biết đâu chúng ta lại có một bản Karaoke hoàn chỉnh?

- Menu... nhúc nhích:
Trình đơn là phần không thể thiếu trong những website có thật nhiều các thông tin. Đoạn JavaScript trên website e-Chíp sẽ giới thiệu với các bạn trình đơn biết “nhúc nhích” liên tục, và đổi cách thể hiện liên kết khi bạn trỏ chuột về phía nó.

- Kết hợp các trang tìm kiếm:
Đôi khi bạn muốn thêm phần tìm kiếm vào website của mình, nhưng thật khó khăn để có thể xây dựng một công cụ tìm kiếm (search engine). Nếu muốn, bạn có thể “nhờ” các trang tìm kiếm nổi tiếng như Yahoo!, Infoseek, vv... “ra tay nghĩa hiệp”. Để biết cách kết nối, mời bạn vào thăm website e-Chíp mục JavaScript để tải chương trình về.

- Bắn pháo hoa:
“Bắn pháo hoa” là tiết mục rất hấp dẫn và đẹp mắt, sao bạn không thử lấy chương trình này về “vọc” thử. Bạn có thể thay đổi các thông số để có những tốc độ bắn, loại “pháo” khác nhau, vv...

- Con trỏ chuột... hình trái tim
Ngày lễ Tình nhân 14-02 vừa qua rồi, nếu không bạn có thể làm một trang web để tỏ tình với nàng và chọn con trỏ chuột hình trái tim này thì thật … là hết ý! Mời bạn vào website e-Chíp để tải về đoạn JavaScript cùng các hình ảnh “minh họa”.

Thường trên các website luôn có liên kết “Contact” để liên lạc với “chủ nhân” , xin giới thiệu cùng các bạn chiêu “bung cửa sổ” để trang web có phần sinh động, lôi cuốn hơn. Khi bạn nhấp chuột vào liên kết “Contact”, một cửa sổ mới sẽ hiện ra, mở rộng chiều dọc và sau đó là chiều ngang đến tối đa.

- Trang trí liên kết kiểu... Spider
Xin giới thiệu cùng các bạn cách trang trí “kết hợp” giữa các liên kết và con trỏ chuột để tăng sự sinh động cho website. Vị trí chuột sẽ là tâm điểm cho một loạt các đường kẻ tạo cảm giác lưới nhện, đồng thời khi bạn rê chuột lên trên, “lưới nhện” và liên kết sẽ đổi màu giúp bạn dễ theo dõi. Bạn có thể tải chương trình nguồn từ website e-Chíp mục thư viện JavaScript.

Bạn có thể so sánh chức năng của chiếc máy tính JavaScript này với máy tính thông thường và chắc hẳn bạn sẽ ... hài lòng! Máy được thiết kế với nhiều “khuyến mãi” như: tính lũy thừa x^y, giai thừa, vv… Các chức năng này được phân thành năm nhóm và thay đổi bằng cách nhấp chuột vào nút “More Options”.

Các liên kết đôi khi không diễn tả được hết ý nghĩa và đôi khi người lướt web phải mất thời gian để tìm hiểu. Bạn có thể “giải quyết” đơn giản bằng cách thêm dòng chú thích vào các liên kết, đoạn văn bản này chỉ hiện ra khi người lướt web rê chuột lên bên trên. Trong dòng chú thích bạn mô tả rõ hơn nội dung mà liên kết trỏ đến.

Có rất nhiều các trang trí cho con trỏ chuột ( đồng hồ, chữ, hình ảnh xoay quanh, vv...) và độ sinh động của chúng đối với người lướt web cũng rất khác nhau. Xin giới thiệu với các bạn một “chiêu” về con trỏ chuột khá hấp dẫn: các quả bóng “dí” theo tọa độ chuột, đồng thời xoay vòng tạo ra những chuyển động rất đẹp mắt và hấp dẫn.

Bạn thích trang trí lại thanh cuộn với màu sắc bắt mắt hơn? Rất đơn giản, chỉ cần hơn 10 dòng lệnh JavaScript, bạn có thể dễ dàng thay đổi màu sắc các thành phần trong thanh cuộn “made in tự tui” rồi.

Bạn đã biết cách gắn một dòng văn bản (text) vào “đuôi chuột”, bạn đã biết cách tạo dòng chữ chuyển động mô phỏng không gian ba chiều (3D), sao bạn không thử kết hợp hai công đoạn này với nhau? Mời bạn ghé thăm website e-Chíp mục “Thư viện JavaScript” để tải mã nguồn chương trình “Chữ xoay quanh chuột 3D” về xài thử.

Bạn chỉ cần rê chuột lên các mục “Phóng to”, “Bình thường”, hay “Thu nhỏ” để điều chỉnh kích cỡ ảnh. Thật thuận tiện và đơn giản phải không bạn?

Nếu bạn đã thiết kế một logo cho mình và đặt lên trang web thì tại sao bạn không thử cho logo đó xoay ở một góc màn hình nhỉ? Bạn có thể tải về và tìm hiểu đoạn chương trình tôi giới thiệu rồi cải tiến cho phù hợp với trang web của bạn. Công đoạn sau cùng chỉ là... thay đổi logo mới thôi.

Xin giới thiệu với các bạn một “chiêu” hấp dẫn: dùng kính lúp soi ảnh trên web. Người lướt web dùng chuột để “nắm” kính lúp và khi chuột di chuyển, kính lúp sẽ soi theo, phần ảnh phóng to tương ứng hiển thị gần bên. Đây là một hiệu ứng rất độc đáo và công phu, mong là các bạn sẽ thích...

Nhiều hình ảnh của vị thần tình yêu sẽ bay... lơ lửng trên trang web của bạn. Tuy nhiên bạn có thể thay đổi số lượng hình ảnh, tốc độ di chuyển hình,vv... thật dễ dàng ( chương trình có chú thích chi tiết các thông số ). Kỹ thuật di chuyển ảnh dùng “layer” này cũng thường được sử dụng trong các minigame viết bằng Javascript trên mạng, bạn thử tìm hiểu xem.

Bạn từng thấy các dòng quảng cáo khá bắt mắt trên những trang web? Thay vì phải dùng những phần mềm tạo chữ “nhảy múa” 3D phức tạp (tất nhiên chất lượng hình ảnh cao hơn) và mất khá nhiều thời gian, bạn có thể sử dụng những bộ lọc “có sẵn” trong Javascript. Đơn giản hơn nhiều mà hiệu quả cũng... được lắm!

Chú gà e-Chíp đang “hăm hở” dưới ánh đèn sân khấu... thật đẹp và hấp dẫn phải không bạn? Hiệu ứng đèn “follow” chiếu theo từng vùng trên ảnh đích có thể sẽ làm ngạc nhiên và gây ấn tượng với những vị khách tham quan website của bạn. Chương trình có thể tải về từ website e-Chíp mục “Thư viện Javascript”.

Xin giới thiệu cùng các bạn một bản đồ “kỹ thuật số” hấp dẫn. Muốn phóng to hay thu nhỏ bạn chỉ cần nhấp chuột vào hai nút tương ứng (nằm bên cạnh bản đồ). Các bạn có thể xem mã nguồn chương trình để tìm hiểu và thay đổi tỷ lệ phóng, cũng như góc xoay theo ý muốn.

Hiệu ứng chữ ngược (đổ bóng cho chữ) rất đơn giản mà thật hiệu quả. Nếu kết hợp cùng việc làm nhòe khung hình, bạn sẽ có thêm hiệu ứng “soi mặt hồ” thật đẹp. Bạn có thể vào website eChíp mục “Thư viện JavaScript” để tải mã nguồn về.

Với vài cách thể hiện (cuộn hình từ trái sang, từ trên xuống, đan lưới các ô vuông, vv...) và kết hợp chúng cùng nhau, bạn đã có đoạn mã JavaScript ngắn nhưng “đủ xài” để làm “banner” quảng cáo. Những hình ảnh sinh động này luôn tăng sự hấp dẫn cho trang web, đồng thời bạn cũng có thể gởi thêm thông tin cho người lướt web.

Đoạn mã JavaScript được sử dụng để truyền các thông số cho một JavaApplet, các liên kết di chuyển trông như đoạn phim đang chiếu. Hiệu quả thật tuyệt vời phải không các bạn? Mã nguồn ngắn gọn và rất đơn giản, bạn chỉ cần thay đổi các liên kết cho phù hợp với website của mình.

”Dân” làm web luôn cố gắng gây ấn tượng đối với khách tham quan “ngôi nhà” trên mạng của mình. Do đó các hình ảnh và liên kết thường được chăm chút kỹ để tạo nét hấp dẫn riêng. Xin giới thiệu cùng bạn một chiêu: “nổ tung” tên liên kết bay ra thành nhiều hướng khi trỏ chuột vào nó.

Số 86 (09-04-2004)

- Đôi mắt lém lỉnh...

Bạn hãy thử tải đoạn JavaScript này về rồi thử xem, khi bạn di chuyển chuột đến đâu, đôi mắt sẽ “liếc” theo đến đó. Chỉ khi nào bạn di chuyển chuột ra ngoài vùng thể hiện của trang web thì đôi mắt này mới bị “ngoài vùng phủ sóng” thôi.

- Chữ quay chong chóng

Xin giới thiệu cùng các bạn một hiệu ứng đơn giản: cho một dòng văn bản xoay tròn như chong chóng, với kích thước to dần. Bạn chỉ nên dùng đoạn mã này khi website bạn có không gian trình bày và bạn muốn nó thêm phần sinh động.

- Rồng vàng

Bạn có bao giờ thấy một đoạn text bay lượn trên trang web trông như chú “Rồng Vàng” chưa? Mời các bạn vào website e-Chíp mục Thư viện JavaScript để lấy chương trình này về. Rất đẹp mắt đó bạn.

Số 88 (16-04-2004)

Screensaver – trình bảo vệ màn hình đôi khi còn giúp chúng ta có những giây phút thư giãn với các hình ảnh hết sức tuyệt vời đi kèm. Xin giới thiệu cùng các bạn một “hồ cá” thật dễ thương mô phỏng các Screensaver để “ngâm cứu”.

Tương tự thủ thuật soi hình, tuy nhiên bạn phải làm cho khung hình trong suốt để tăng độ hấp dẫn. Khách thăm website của bạn sẽ nhấp và giữ chuột trái, sau đó di chuyển chuột để xem hình ảnh (hay nội dung) bên dưới.

Nếu trên bàn làm việc có một bộ lịch “khuyến mãi” đồng hồ thì quá thuận tiện phải không các bạn? Mời các bạn vào website e-Chíp để tải chương trình về.

Menu cho trang web được thiết kế với màu sắc trang nhã, dễ theo dõi. Khi bạn di chuyển chuột đến một mục nào trong menu, chú gà con - “linh vật” của e-Chíp sẽ bay theo. Bạn chỉ cần tìm một góc thích hợp để trình bày menu này trên trang web của mình thôi.

Bạn có thể thêm nhiều ý nghĩa hơn cho các liên kết bằng cách hiển thị thêm hình và/hoặc logo của Website được liên kết. Hình ảnh sẽ được hiện ra khi người lướt Web trỏ chuột vào liên kết.

Dòng chữ xoay quanh con trỏ chuột là một hiệu ứng phổ biến trên các trang Web và có nhiều cách thực hiện. Nếu để ý bạn sẽ thấy khi di chuyển chuột thì dòng chữ cũng uốn lượn theo những đường cong đặc trưng (ở các Script khác nhau).

Tương tự hiệu ứng "mưa rơi". Tuy nhiên, bạn thay đổi hướng di chuyển thành trái-phải hoặc phải-trái, đồng thời tạo ra các mức tốc độ di chuyển khác nhau (nhằm tạo chiều sâu như không gian 3 chiều, ở tốc độ bằng nhau vật thể ở gần trông như chuyển động nhanh hơn). Như vậy là trang Web của bạn xem như được đặt vào một không gian huyền ảo rồi đó.

Xin giới thiệu cùng các bạn một chiếc đồng hồ có vẻ đẹp rất cổ điển. Bạn hoàn toàn có thể "treo" chiếc đồng hồ này lên trang Web của mình.

Cho logo của mình xuất hiện cố định trên Website đôi lúc cũng nhàm chán, bạn có thể thử cho logo bay "lòng vòng" trên trang quảng cáo. Logo sẽ chợt ẩn chợt hiện nên không làm "rối" tầm nhìn của người lướt Web.

Đồng hồ gắn trên các website thường là “điện tử” (không có kim) hoặc là dạng đồng hồ “treo tường”, tôi xin giới thiệu với các bạn một chiếc đồng hồ đeo tay rất dễ thương, ngoài chức năng báo giờ (đương nhiên) nó còn báo luôn thứ mấy trong tuần, ngày mấy trong tháng...

Còn đây là cổ động viên nhiệt tình và vô tư nhất, bạn có thể gắn cổ động viên này lên bất kỳ trang web nào. Nếu muốn cổ vũ lần nữa bạn chỉ cần nhấp chuột vào nút nhấn cạnh hình là xong, lúc này bạn có thể thưởng thức một màn biểu diễn hoạt ảnh bằng các ký tự ráp lại.

Đây là chương trình cho phép bạn có được mã RGB từ các màu thường gặp, bạn có thể thêm sáng, hoặc cho màu gốc tối đi. Nếu muốn, bạn cũng có thể gõ trực tiếp các thông số RGB (theo dec hoặc hex) để xem thử hiệu quả màu mình chọn.

Trái banh sẽ dội xuống đáy màn hình (điểm bắt đầu ở vị trí bạn nhấp chuột) và nảy lên, độ cao giảm dần cho đến khi chuyển động dừng hẳn. Bạn có thể áp dụng hiệu ứng rất đẹp mắt này cho một dãy các ký tự.

Giữa nhiều loại menu trên trang Web, menu di chuyển được có một vị trí “không đụng hàng”. Để bắt đầu di chuyển menu, bạn nhấp chuột vào thanh tiêu đề, sau đó “thả” menu đến vị trí mới bằng cách nhấp đúp chuột.

Biểu đồ trong Office thật đơn giản phải không bạn, tuy nhiên tôi muốn giới thiệu với các bạn một cách thể hiện biểu đồ trên trang Web dùng JavaScript. Các bạn có thể nhập thẳng số liệu vào các ô nhập liệu, sau đó nhấp chuột vào nút “vẽ”, thế là xong!